<!DOCTYPE html>
<html>
<head>
<script>

if (window.testRunner) {
    testRunner.waitUntilDone();
}

var videosLoaded = 0;

function onVideoLoaded(e) {
    videosLoaded = videosLoaded + 1;
    if (window.testRunner && videosLoaded == 3) {
        testRunner.notifyDone();
    }
}

function onLoad() {
    var video1 = document.getElementById('video1');
    var video2 = document.getElementById('video2');
    var video3 = document.getElementById('video3');
    video1.src = "content/test.ogv";
    video2.src = video1.src;
    video3.src = video1.src;

    video1.load();
    video2.load();
    video3.load();
    video1.addEventListener("canplay", onVideoLoaded);
    video2.addEventListener("canplay", onVideoLoaded);
    video3.addEventListener("canplay", onVideoLoaded);
}

</script>
</head>
<body onload="onLoad();">
    Test to verify that drawing a video to a 2D canvas with drawImage and with a CanvasPattern works as expected.
    <video id="video1"></video>
    <video id="video2"></video>
    <video id="video3"></video>
</body>
</html>
